<template>
  <div class='meeting-paper'>
    <div id="editor"></div>
    
    <div class="file-list">
      <el-upload class="upload-demo" :action="uploadUrl" accept=".xls,.xlsx,.zip,.rar,.doc,.docx" :on-success="handelSuccess" :file-list="fileList" :multiple='false' :limit="1" :on-exceed='forMore'>
        <el-button size="small" type="primary" title="上传会议附件">点击上传附件</el-button>
        <div slot="tip" class="el-upload__tip">干哈</div>
      </el-upload>
    </div>
  </div>
</template>
<script>
export default {
  components: {},
  name: "",
  data() {
    return {
      editor: null,
      uploadUrl:PATH+'answer/importFile.do',
      fileList:[
        // {name:"",url:''}
      ],//上传文件列表
    };
  },
  methods: {
    // 获取富文本内容
    getContent() {
      var content = this.editor.txt.html();
    },
    setContent(html) {
      this.editor.txt.html(html);
    },
    handelSuccess(res,file){
      _g.toMessage({status:0,msg:'上传成功'})
      this.$store.state.add.info.materialUrl=file.response
      this.$store.state.add.info.fileName=file.name
    },
    forMore(){
      _g.toMessage({status:1,msg:'多个附件请使用压缩包上传'})
    }
  },
  created() {},
  mounted() {
    var that = this;
    var E = window.wangEditor;
    this.editor = new E("#editor");
    // 配置上传图片地址

    this.editor.customConfig.uploadImgServer = picPath;
    this.editor.customConfig.uploadFileName = 'file'
    this.editor.customConfig.zIndex=50
    this.editor.customConfig.uploadImgHooks={
      customInsert: function (insertImg, result, editor) {
        var url = result.data
        insertImg(url)
      }
    }
    this.editor.customConfig.onblur = function(html) {
      // html 即编辑器中的内容
      that.$store.state.add.info.material = html;
    };
    this.editor.create();

    this.$nextTick(() => {
      this.setContent(that.$store.state.add.info.material);
      if(this.$store.state.add.info.materialUrl){
        this.$set(this,'fileList',[
          {
            name:this.$store.state.add.info.fileName||'附件',
            url:this.$store.state.add.info.materialUrl
          }
        ])
      }
    });
    
  }
};
</script>
<style lang="scss" scoped>
.meeting-paper {
  padding: 15px 20px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;

  #editor {
    height: 60%;
  }
  .file-list{
    padding-top: 15px;
  }
}
</style>